<!doctype html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="description" content="${title}">
  <meta name="keywords" content="青菜萝卜 ,个人博客,${tags}">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
  <title>${title} | 青菜萝卜胡丁程序员技术分享博客</title>
  <meta name="renderer" content="webkit">
  <link rel="shortcut icon" type="image/png" href="static/i/favicon.png">
  <meta http-equiv="Cache-Control" content="no-siteapp"/>
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
  <meta name="apple-mobile-web-app-title" content="${title} | 青菜萝卜胡丁程序员技术分享博客"/>
  <meta name="msapplication-TileColor" content="#0e90d2">
  <link rel="stylesheet" href="static/editor.md/css/editormd.min.css" />
  <link rel="stylesheet" href="static/css/amazeui.min.css">
  <link rel="stylesheet" href="static/layui/css/layui.css"/>
  <link rel="stylesheet" href="static/css/qingcai.css"/>
</head>

<body>
	<header class="am-topbar am-topbar-fixed-top qing-header">
		<div class="am-g am-g-fixed">
		  <h1 class="am-topbar-brand">
	      <a class="qing-logo" href="index.html"></a>
	    </h1>
			<!-- nav start -->
			<nav class="am-g am-g-fixed qing-fixed qing-nav">
				<button class="am-topbar-btn am-topbar-toggle am-btn am-btn-sm am-show-sm-only qing-btn-mobile" data-am-collapse="{target: '#blog-collapse'}" ><span class="am-sr-only">导航切换</span> <span class="am-icon-bars"></span></button>
			  <div class="am-collapse am-topbar-collapse" id="blog-collapse">
			    <ul class="am-nav am-nav-pills am-topbar-nav">
			      <li><a href="index.html"><i class="am-icon-home"></i> 首页</a></li>
			      <li><a href="about.html"><i class="am-icon-info"></i> 关于本站</a></li>
			      <li><a href="works.html"><i class="am-icon-code"></i> 我的作品</a></li>
			      <li><a href="message.html"><i class="am-icon-paper-plane"></i> 留言墙</a></li>
			      <li><a href="donate.html"><i class="am-icon-share-alt"></i> 赞助作者</a></li>
			    </ul>
			    <form class="am-topbar-form am-topbar-right am-form-inline layui-form am-hide-sm-only" lay-submit lay-filter="search" role="search">
			      <div class="am-form-group am-form-icon">
			        <input id="search" name="search" type="text" required lay-verify="required" class="am-form-field am-input-sm am-radius" placeholder="请输入要搜索的关键词">
			        <i class="am-icon-search"></i>
			        <button id="btn-search"  type="button" lay-submit lay-filter="search" class="layui-btn layui-btn-small am-hide-sm-only qing-btn-search">搜索</button>
			      </div>
			    </form>
			  </div>
			</nav>
		</div>
	<!-- nav end -->
	</header>
	<!--mobile search input start -->
	<div class="am-show-sm-only am-u-sm-12 qing-sm-search">
		<form class="m-topbar-form am-topbar-right am-form-inline layui-form" lay-submit lay-filter="searchSM" role="search">
	      <div class="am-form-group am-form-icon">
	      	<i class="am-icon-search"></i>
	        <input id="search-sm" name="search" type="text" class="am-form-field am-form-field am-radius" placeholder="请输入要搜索的关键词" required lay-verify="required">
	      </div>
			</form>
	</div>
	<!--mobile search input end -->
	<!-- content srart -->
	<div class="am-g am-g-fixed qing-fixed qing-container">
		  <!-- 正文内容开始-->
	    <div class="am-u-md-8 am-u-sm-12">
	    		<!-- 通知公告开始 -->
	    		<div id="qing-notice-cnt"></div>
	    		<!-- 通知公告结束 -->
	    	<!--nav start-->
	    	<div class="qing-blog-nav">
	    		<a href="index.html"><i class="am-icon-home"></i>首页</a> <i class="am-icon-angle-double-right"></i> <a href="${url}">${title}</a>
	    	</div>
	    	<!--nav end-->
	    	<!-- ad start-->
    		<div id="blog-content-top-ad" class="qing-blog-ad qing-margin-top qing-margin-bottom">
    			广告占位
    		</div>
    		<!-- ad start-->
	    	<!--blog start -->
	    	<div class="qing-content">
	    		<!-- blog header start -->
	    		<div class="qing-blog-header qing-text-center">
	    				<input type="hidden" id="qing-blog-id" value="${id}" />
	    				<h1 class="am-article-title">${title}</h1>
		          <div class="qing-blog-tips">
					       	<span class="qing-blog-tip-c"><i class="am-icon-user qing-color-author" title="作者"></i> ${author} &nbsp;</span>
						      <span class="qing-blog-tip-c"><i class="am-icon-clock-o qing-color-clock" title="时间"></i> ${publishTime}</span>
					        <span class="qing-blog-tip-c"><i class="am-icon-eye-slash qing-color-eye" title="阅读"></i> 阅读(<span id="blog-readNum">${readNum}</span>)</span>
					        <span class="qing-blog-tip-c"><i class="am-icon-comments-o qing-color-comment" title="评论"></i> 评论(<span id="blog-commentNum">${commentNum}</span>)</span>
					        <span class="qing-blog-tip-c"><i class="am-icon-heart-o qing-color-heart" title="点赞"></i> 点赞(<span id="blog-heartNum">${heartNum}</span>)</span>
				      </div>
	    		</div>
	    		<!-- blog header end -->
	    		<!-- blog summary start -->
	    		<div class="qing-margin-top"> 
        		 <p><div class="qing-blog-summary"><strong>摘要：${summary}</strong></div></p> 
	    		</div>
	    		<!-- blog summary end -->
	    		<!-- blog content start -->
	    		<div class="qing-margin-top qing-blog-content" id="article-editormd-view">
	    				 ${html}
	    		</div>
	    		<!-- blog content end -->
	    		
	    		<div class="qing-blog-zhuanzai">
	    			转载请注明：<a href="http://www.huding.name">青菜萝卜胡丁博客</a> » <a href="http://www.huding.name/${url}">${title}</a>
	    		</div>
	    		
	    		<div class="qing-blog-social">
	    				<span class="qing-blog-action qing-blog-like"> 
	    					<i class="am-icon-heart"></i> 喜欢 (<span id="blog-content-like" class="count">${heartNum}</span>)
	    				</span>
							<span class="or">or</span>
							<span class="qing-blog-action qing-blog-share">
								<i class="am-icon-share-alt"></i> 分享 (<span id="blog-content-share" class="bds_count" data-cmd="count" title="累计分享0次">0</span>)
								<!-- <div class="action-popover">
									<div class="popover top in">
										<div class="arrow"></div>
										<div class="popover-content">
											<a href="#" class="sinaweibo fa fa-weibo" data-cmd="tsina" title="" data-original-title="分享到新浪微博"></a>
											<a href="#" class="bds_qzone fa fa-star" data-cmd="qzone" title="" data-original-title="分享到QQ空间"></a>
											<a href="#" class="tencentweibo fa fa-tencent-weibo" data-cmd="tqq" title="" data-original-title="分享到腾讯微博"></a>
											<a href="#" class="qq fa fa-qq" data-cmd="sqq" title="" data-original-title="分享到QQ好友"></a>
											<a href="#" class="bds_renren fa fa-renren" data-cmd="renren" title="" data-original-title="分享到人人网"></a>
											<a href="#" class="bds_weixin fa fa-weixin" data-cmd="weixin" title="" data-original-title="分享到微信"></a>
											<a href="#" class="bds_more fa fa-ellipsis-h" data-cmd="more" data-original-title="" title=""></a>
										</div>
									</div>
								</div> -->
							</span>	
					</div>
	    		
	    		<div class="qing-blog-donate qing-text-center">
	    				<p>您的支持是博主写作最大的动力，如果您喜欢我的文章，感觉我的文章对您有帮助，请狠狠点击下面的</p>
	    				<input type="button" id="btn-donate" value="我要小额赞助" class="qing-btn-donate"/>
	    		</div>
	    		
	    		<!-- blog tag  start -->
    			<div class="qing-margin-top qing-blog-tag">
	            <i class="am-icon-tags"> &nbsp;</i>
	            <%
								for(blogTag in blogTags){
								   print('<span class="am-radius">#' + blogTag + '</span>');
								}
						  %>
	        </div>
	    		<!-- blog tag  end -->
	    	</div>
	    	<!--blog end -->
	    	
	    	<!-- blog footer start-->
    		<div class="qing-blog-foot am-hide-sm-only">
    				<span class="left"><i class="am-icon-angle-double-left"></i>&nbsp;<a href="${preURL}">${preTitle}</a></span>
    				<span class="right"><a href="${nextURL}">${nextTitle}</a>&nbsp;<i class="am-icon-angle-double-right"></i></span>
    		</div>
    		<div class="qing-blog-foot am-show-sm-only">
    				<span><i class="am-icon-angle-double-left"></i>&nbsp;<a href="${preURL}">${preTitle}</a></span><br>
    				<span><i class="am-icon-angle-double-right"></i>&nbsp;<a href="${nextURL}">${nextTitle}</a></span>
    		</div>
	    	<!-- blog footer end-->
	    	
	    	<!-- dynamic more blog start-->
				<div class="qing-margin-top" id="hot-rank-blogs"></div>
	    	<!-- dynamic more blog end-->
    		<!-- ad start-->
    		<div id="blog-content-bottom-ad" class="qing-blog-ad qing-margin-top">
    			广告占位
    		</div>
    		<!-- ad start-->
    		<!-- comment start-->
    		<div class="qing-content qing-margin-top" id="commentContainer"></div>
	    	<!-- comment end-->
	    </div>
	    <!--正文内容结束-->
			<!-- 侧边栏 开始-->
	    <div class="am-u-md-4 am-u-sm-12" id="qing-left"></div>
	    <!-- 侧边栏结束-->
	</div>
	<!-- content end -->

  <footer class="qing-footer">
    <div class="qing-text-center">
       <h3><strong>青菜萝卜胡丁程序员技术分享博客简介</strong></h3>
       <p class="am-text-sm">青菜萝卜胡丁程序员技术分享博客定位为IT技术博客站，博客内容主要涉及编程语言、推荐算法、数据挖掘等方面，分享实用的学习和开发资料。 </p>
    </div>
    <div class="qing-text-center">Copyright © 2016 青菜萝卜 胡丁  |  联系我 : xxxxxxxx@qq.com  |  All Rights Reserved.  |  蜀ICP备xxxxxxx</div>    
  </footer>
  <script src="static/js/jquery.min.js"></script>
  <script src="static/js/amazeui.min.js"></script>
	<script src="static/layui/layui.js"></script>
	<script>
		layui.config({base:'static/js/'}).use('qingblog');
	</script>
	<!-- editor.md parser  -->
	<script src="static/editor.md/lib/marked.min.js"></script>
	<script src="static/editor.md/lib/prettify.min.js"></script>
	<script src="static/editor.md/editormd.min.js"></script>
	<script type="text/javascript">
	   $(function() {
	      var articleEditormdView;
	      articleEditormdView = editormd.markdownToHTML("article-editormd-view", {
	      	htmlDecode      : "style,script,iframe",  // you can filter tags decode
	      	/* emoji           : true, */
	      	taskList        : true,
	      	/* tex             : true,  // 默认不解析
	      	flowChart       : true,  // 默认不解析
	      	sequenceDiagram : true,  // 默认不解析 */
	      });
	   });
	</script>
	<script src="static/js/badutongji.js" ></script>
	<script src="static/js/alibaba.js"></script>
</body>
</html>